<%@ include file="common.jsp"%>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style type="text/css">
body {
	overflow-x: hidden;
	overflow-y: hidden;
}

th, td {
	text-align: center;
}

#tab_data td {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
</style>
</head>
<body>
	<div style="float: right; text-align: right; margin: 15px 0;">
		<button type="button" class="btn btn-default" onclick="add()">新增</button>
	</div>
	<table class="table table-bordered" style="table-layout: fixed">
		<thead>
			<tr>
				<th>卡号</th>
				<th>姓名</th>
				<th>电话</th>
				<th>余额</th>
				<th>积分</th>
				<th>卡类型</th>
				<th>注册时间</th>
				<th>操作选项</th>
			</tr>
		</thead>
		<tbody id="tab_data"></tbody>
	</table>
	<div align="center"><nav><ul id="pagination" class="pagination"></ul></nav></div>
</body>
<script type="text/javascript">
	var id, model, pageIndex = 1, map = {};

	$(function() {
		load();
	});

	function load() {
		var url = BaseUrl + 'membershipCardAction/doPageCard.action';
		var option = {};
		option['pageIndex'] = pageIndex;
		$.a(url, option, function(res) {
			console.log(res);
			loadData(res);
		}, true);
	}

	function goPage(index) {
		pageIndex = index + '';
		load();
	}

	function loadData(res) {
		var arr = res.list;
		$('#tab_data').empty();
		for (var i = 0; i < arr.length; i++) {
			var $tr = $('<tr>');
			$('<td>' + arr[i].cid + '</td>').appendTo($tr);
			$('<td>' + arr[i].name + '</td>').appendTo($tr);
			$('<td>' + arr[i].number + '</td>').appendTo($tr);
			$('<td>' + arr[i].balance + '</td>').appendTo($tr);
			$('<td>' + arr[i].integral + '</td>').appendTo($tr);
			switch (arr[i].type) {
			case 1:
				$('<td>虚拟卡</td>').appendTo($tr);
				break;
			case 2:
				$('<td>实体卡</td>').appendTo($tr);
				break;
			default:
				$('<td>未知</td>').appendTo($tr);
			}
			$('<td>' + arr[i].createTime + '</td>').appendTo($tr);
			$('<td><a href="javascript:void(0)" onclick="edit(\''
							+ arr[i].id
							+ '\')">编辑</a> | <a href="javascript:void(0)" onclick="del(\''
							+ arr[i].id + '\')">删除</a></td>')
					.appendTo($tr);
			$tr.appendTo('#tab_data');
			map[arr[i].id] = arr[i];
		}

		if (arr.length == 0) {
			$('.div_message').html($('<p style="text-align: center; margin-top: 70px;">无数据</p>'));
		}
		// 加载分页
		var page = res.page;
		$('#pagination').empty();
		if (page.pageTotal > 1) {
			if (page.pageIndex <= 1) {
				$('<li class="disabled"><a href="javascript:void(0)" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li>').appendTo('#pagination');
				$('<li class="disabled"><a href="javascript:void(0)">&lsaquo;</a></li>').appendTo('#pagination');
			} else {
				$('<li><a href="javascript:void(0)" aria-label="Previous" onclick="goPage(1)"><span aria-hidden="true">&laquo;</span></a></li>').appendTo('#pagination');
				$('<li><a href="javascript:void(0)" onclick="goPage('	+ (page.pageIndex - 1) + ')">&lsaquo;</a></li>').appendTo('#pagination');
			}
			var parr = page.pageArray;
			for (var i = 0; i < parr.length; i++) {
				if (parr[i] == page.pageIndex) {
					$('<li class="active"><a>' + parr[i] + '</a></li>').appendTo('#pagination');
				} else {
					$('<li><a href="javascript:void(0)" onclick="goPage('	+ parr[i] + ')">' + parr[i]	+ '</a></li>').appendTo('#pagination');
				}
			}
			if (page.pageIndex >= page.pageTotal) {
				$('<li class="disabled"><a href="javascript:void(0)">&rsaquo;</a></li>').appendTo('#pagination');
				$('<li class="disabled"><a href="javascript:void(0)" aria-label="Next"><span aria-hidden="true">&raquo;</span></a></li>').appendTo('#pagination');
			} else {
				$('<li><a href="javascript:void(0)" onclick="goPage('	+ (page.pageIndex + 1) + ')">&rsaquo;</a></li>').appendTo('#pagination');
				$('<li><a href="javascript:void(0)" aria-label="Next" onclick="goPage(' + page.pageTotal + ')"><span aria-hidden="true">&raquo;</span></a></li>').appendTo('#pagination');
			}
		}
	}

	function add() {
		model = 0;
		layer.open({
			type : 2,
			title : '注册会员卡',
			area : [ '800px', '255px' ],
			content : 'update_mcm.jsp'
		});
	}

	function edit(id) {
		this.id = id;
		model = 1;
		layer.open({
			type : 2,
			title : '编辑会员卡信息',
			area : [ '800px', '255px' ],
			content : 'update_mcm.jsp'
		});
	}

	function del(id) {
		layer.confirm('是否确定删除？', {
			btn : [ '确定', '取消' ]
		}, function() {
			var url = BaseUrl + 'membershipCardAction/deleteCardById.action';
			var option = {};
			option['id'] = id;
			$.a(url, option, function(res) {
				if (res.result) {
					load();
					layer.msg('删除成功', {
						time : 2000
					});
				} else {
					layer.msg(res.message, {
						time : 2000
					});
				}
			}, false);
		});
	}
</script>
</html>